<!DOCTYPE html>
<html lang="zh">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="format-detection" content="telephone=no">
    <meta name="msapplication-tap-highsecondary" content="no">
    <meta name="viewport" content="user-scalable=no,initial-scale=1,maximum-scale=1,minimum-scale=1,width=device-width">

    <title>工单申请</title>
    <link href="../lib/fonts/material-icons.css?family=Material+Icons" rel="stylesheet">
    <link href="../lib/css/animate.min.css" rel="stylesheet">
    <link href="../lib/css/quasar.mat.rtl.min.css" rel="stylesheet" type="text/css">
    <style>
      [v-cloak] { display: none }
      .bdl-secondary-3 { border-left: 3px solid #26a69a }
    </style>
  </head>
  <body>
    <div id="q-list" v-cloak>
      <q-card class="bg-white no-shadow full-width">
        <q-card-title>摄影师工单</q-card-title>
        <q-card-separator></q-card-separator>
        <q-card-main class="bd-light">
          <p class="q-mb-none bdl-secondary-3 q-py-xs q-px-sm">工单基本信息</p>
          <div class="row justify-start gutter-sm q-px-sm">
            <q-field class="col-lg-3 col-md-3 col-sm-12 col-xs-12">
              <q-input
                float-label="工单编号"
                v-model.trim="searchForm.col1"></q-input>
            </q-field>
            <q-field class="col-lg-3 col-md-3 col-sm-12 col-xs-12">
              <q-input
                float-label="工单类型"
                v-model.trim="searchForm.col2"></q-input>
            </q-field>
            <q-field class="col-lg-3 col-md-3 col-sm-12 col-xs-12">
              <q-input
                float-label="旧工单编号"
                v-model.trim="searchForm.col3"></q-input>
            </q-field>
            <q-field class="col-lg-3 col-md-3 col-sm-12 col-xs-12">
              <q-input
                float-label="名称"
                v-model.trim="searchForm.col4"></q-input>
            </q-field>
            <q-field class="col-lg-3 col-md-3 col-sm-12 col-xs-12">
              <q-input
                float-label="开始时间"
                v-model="searchForm.col5"></q-input>
            </q-field>
          </div>
          <p class="q-mb-none bdl-secondary-3 q-py-xs q-px-sm q-mt-md">联系人信息</p>
          <div class="row justify-start gutter-sm q-px-sm">
            <q-field class="col-lg-3 col-md-3 col-sm-12 col-xs-12">
              <q-input
                float-label="TR联系人"
                v-model.trim="searchForm.col6"></q-input>
            </q-field>
            <q-field class="col-lg-3 col-md-3 col-sm-12 col-xs-12">
              <q-input
                float-label="电子邮件"
                v-model.trim="searchForm.col7"></q-input>
            </q-field>
            <q-field class="col-lg-3 col-md-3 col-sm-12 col-xs-12">
              <q-input
                float-label="AGM联系人名称"
                v-model="searchForm.col8"></q-input>
            </q-field>
            <q-field class="col-lg-3 col-md-3 col-sm-12 col-xs-12">
              <q-input
                float-label="AGM联系方式"
                v-model="searchForm.col9"></q-input>
            </q-field>
          </div>
          <p class="q-mb-none bdl-secondary-3 q-py-xs q-px-sm q-mt-md">拍摄信息</p>
          <div class="row justify-start gutter-sm q-px-sm">
            <q-field class="col-lg-3 col-md-3 col-sm-12 col-xs-12">
              <q-select
                float-label="城市"
                :options="[{ label: '上海',value: 'sh'}]"
                v-model.trim="searchForm.col10"></q-select>
            </q-field>
            <q-field class="col-lg-3 col-md-3 col-sm-12 col-xs-12">
              <q-select
                float-label="酒店编号"
                :options="[{ label: '001',value: '001'}]"
                v-model.trim="searchForm.col11"></q-select>
            </q-field>
            <q-field class="col-lg-3 col-md-3 col-sm-12 col-xs-12">
              <q-input
                float-label="酒店名称"
                v-model.trim="searchForm.col12"></q-input>
            </q-field>
            <q-field class="col-lg-3 col-md-3 col-sm-12 col-xs-12">
              <q-input
                float-label="酒店地址"
                v-model="searchForm.col13"></q-input>
            </q-field>
            <q-field class="col-lg-3 col-md-3 col-sm-12 col-xs-12">
              <q-input
                float-label="CRS ID"
                v-model="searchForm.col14"></q-input>
            </q-field>
            <q-field class="col-lg-3 col-md-3 col-sm-12 col-xs-12">
              <q-input
                float-label="需求拍摄日期"
                v-model.trim="searchForm.col15"></q-input>
            </q-field>
            <q-field class="col-lg-3 col-md-3 col-sm-12 col-xs-12">
              <q-input
                float-label="拍摄房型"
                v-model="searchForm.col16"></q-input>
            </q-field>
            <q-field class="col-lg-3 col-md-3 col-sm-12 col-xs-12">
              <q-input
                float-label="特殊需求"
                v-model="searchForm.col17"></q-input>
            </q-field>
          </div>
        </q-card-main>
        <q-card-actions class="q-px-md row">
          <q-btn class="full-width" color="primary" outline label="驳回"></q-btn>
          <q-btn class="full-width q-mt-sm" color="primary" label="通过"></q-btn>
        </q-card-actions>
      </q-card>
    </div>
    
    <!-- ie-polyfill 、 vue.js and quasar-framework -->
    <script src="../lib/js/quasar.ie.polyfills.umd.min.js"></script>
    <script src="../lib/js/vue.js"></script>
    <script src="../lib/js/quasar.mat.umd.min.js"></script>
    <!-- quasar i18n zh-hans -->
    <script src="../lib/lang/zh-hans.js"></script>
    <!-- vue-i18n for application's internationalization -->
    <script src="../lib/js/vue-i18n.js"></script>
    <script>
      // quasar components use
      Quasar.i18n.set(Quasar.i18n['zhHans'])
			new Vue({
        el: '#q-list',
				data: function() {
					return {
            searchForm: {
              col1: '20181107001',
              col2: '补拍',
              col3: '20181104001',
              col4: 'XXX',
              col5: '11月7日 12:00',
              col6: '酒店交付之前',
              col7: 'TR@OYO.com',
              col8: '酒店交付之后',
              col9: '18890899999',
              col10: 'sh',
              col11: '001',
              col12: '上海明珠酒店',
              col13: '人民路99号',
              col14: 'NS_19009',
              col15: '11月7日',
              col16: 'A205 A207',
              col17: '无',
            },
          }
				},
				computed: {
					
        },
        watch: {
          
        },
        created: function() {
          
        },
				methods: {
					
				}
			})
    </script>
  </body>
</html>